import { Descriptions } from "antd";
import { useModel } from "umi";

import DependentedDatabases from "./detail.database";
import ApplicationDetailTypes from "./detail.types";
import ApplicationDetailVersions from "./detail.versions";

const ApplicationDetail = ({ item }) => {
    return (
        <div>
            <Descriptions size="small" column={2} style={{ padding: "0 20px 1px 20px" }} labelStyle={{ color: "#999", width: 100, textAlign: "right" }}>
                <Descriptions.Item label="应用说明" span={2}>
                    {item.appDesc}
                </Descriptions.Item>
                <Descriptions.Item label="所属角色">{item.appRole || ""}</Descriptions.Item>
                <Descriptions.Item label="登录状态">{item.appLogin === "localLogined" ? "本地登录" : "远程登录"}</Descriptions.Item>
                <Descriptions.Item label="应用分类">{item.acName}</Descriptions.Item>
                <Descriptions.Item label="适用对象">{item.aoName}</Descriptions.Item>
                <Descriptions.Item label="开发者类型">{item.appSdty}</Descriptions.Item>
                <Descriptions.Item label="开发组织">
                    {item.developer?.oiFuna} - {item.appSduu}
                </Descriptions.Item>
                <Descriptions.Item label="创建时间">{formatUTCTime(item.appCrti)}</Descriptions.Item>
                <Descriptions.Item label="更新时间">{formatUTCTime(item.appUpti)}</Descriptions.Item>
            </Descriptions>

            <DependentedDatabases application={item} />

            <div style={{ height: 10 }}></div>

            <ApplicationDetailTypes application={item} />

            <div style={{ height: 10 }}></div>

            <ApplicationDetailVersions application={item} />
        </div>
    );
};

export default ApplicationDetail;
